import * as React from 'react';
import classNames from 'classnames';

            import { tuple } from '../util/type';

const ButtonTypes = tuple('default', 'primary', 'ghost', 'dashed', 'danger', 'link');
export type ButtonType = (typeof ButtonTypes)[number];



export interface BaseButtonProps {
    type?: ButtonType;
    loading?: boolean | { delay?: number };
    className?: string;
    prefixCls?: string,
    children?: React.ReactNode;
    onClick?: React.MouseEventHandler<HTMLElement>;
}

export type NativeButtonProps = {
    onClick?: React.MouseEventHandler<HTMLElement>;
} & BaseButtonProps &
    Omit<React.ButtonHTMLAttributes<any>, 'type' | 'onClick'>;

export type ButtonProps = Partial<NativeButtonProps>;

interface ButtonState {
    loading?: boolean | { delay?: number };
    hasTwoCNChar: boolean;
}

export default class Button extends React.Component<ButtonProps, ButtonState> {

    constructor(props: ButtonProps) {

        super(props);

        this.state = {
            loading: props.loading,
            hasTwoCNChar: false,
        };
    }

    componentDidMount() {

    }

    handleClick: React.MouseEventHandler<HTMLButtonElement> = e => {
        const { loading } = this.state;
        const { disabled } = this.props;
        const { onClick } = this.props;

        if (loading || disabled) {
            return;
        }
        if (onClick) {
            (onClick as React.MouseEventHandler<HTMLButtonElement>)(e);
        }
    }

    render() {
        const { loading } = this.state;

        var {
            type='defaut',
            className,
            disabled,
            prefixCls
        } = this.props;

        prefixCls = prefixCls || "keda-btn"


        const classes = classNames(prefixCls, className, {
            [`${prefixCls}-${type}`]: type,
            [`disabled`]: disabled || loading,
        })

        const renderButton = <button
            className={classes}
            onClick={this.handleClick}
        >
            {this.props.children}
        </button>


        return renderButton;
    }
}